<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="ThemeBucket">
    <link rel="shortcut icon" href="#" type="image/png">

    <title>小工匠订单管理系统</title>

    <link href="<%=path%>/resources/css/style.css" rel="stylesheet">
    <link href="<%=path%>/resources/css/style-responsive.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="<%=path%>/resources/js/html5shiv.js"></script>
    <script src="<%=path%>/resources/js/respond.min.js"></script>
    <![endif]-->
</head>

<body class="sticky-header">

<section>
    <!-- left side start-->
    <%@ include file="/page/common/leftmenu.jsp" %>
    <!-- left side end-->

    <!-- main content start-->
    <div class="main-content" >

        <!-- header section start-->
        <%@ include file="/page/common/top.jsp" %>
        <!-- header section end-->

        <!-- page heading start-->
        <div class="page-heading">
            <h3>

            </h3>
            <ul class="breadcrumb">
                <li>
                    <a href="#">管理平台</a>
                </li>
                <li class="active">业务类型管理</li>

            </ul>
        </div>

        <!-- page heading end-->

        <!--body wrapper start-->
        <section class="wrapper">
            <!-- page start-->
            <div class="row">
                <div class="col-sm-12">
                    <div class="panel">

                        <header class="panel-heading">
                            条件筛选
                            <span class="tools pull-right">
                                <a href="#myModal"  data-toggle="modal" id="addOneType" class="btn">新增一级类型</a>
                                <a href="#myModal2"  data-toggle="modal" id="addTwoType" class="btn">新增二级类型</a>
                                <a href="javascript:void(0)"  data-toggle="modal" id="editType" class="btn">编辑</a>
                                <a href="#" id="delType" class="btn">删除</a>
                             </span>
                        </header>
                        <div class="panel-body toolbar">
                            <div class="row">
                                <div class="col-md-1" style="width:120px">
                                    <label> 业务类型：</label>
                                </div>
                                <div class="col-md-2">
                                    <select id="one_type_select" class="form-control selectpicker" data-live-search="true">
                                        <option value="-1">全部</option>
                                    </select>
                                </div>

                                <div class="col-md-2">
                                    <select id="two_type_select" class="form-control selectpicker" data-live-search="true">
                                        <option value="-1">全部</option>
                                    </select>
                                </div>
                            </div>
                            <p>&nbsp;</p>
                            <div class="row">
                                <div class="col-md-1" style="margin-top: 5px;width:130px">
                                    <label>类型名称：</label>
                                </div>
                                <div class="col-md-2 input-group" style="margin-left: 20px">
                                    <input id="searchKey" class="form-control" type="text" placeholder="请输入关键词">
                                    <span class="input-group-btn">
                                        <button type="button"  onclick="search()" class="btn btn-primary">查询</button>
                                        </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="table table-striped table-hover table-bordered" id="editable-sample">
                <div class="table-responsive" data-pattern="priority-columns" data-focus-btn-icon="fa-asterisk"
                     data-sticky-table-header="true" data-add-display-all-btn="true" data-add-focus-btn="true">
                    <table id="table" data-unique-id="id"
                           data-pagination="true"
                           data-id-field="id"
                           data-maintain-selected="true"
                           data-page-size="10"
                           data-page-list="[5,10,15,20]"
                           data-side-pagination="server">
                    </table>
                </div>
            </div>

            <!-- Modal -->
            <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">新增业务类型</h4>
                        </div>

                        <div class="modal-body row">
                            <div class="col-md-9">
                                <div class="form-group">
                                    类型名称：<input  id="one_type" value="" class="form-control">
                                </div>
                                <div class="pull-right">
                                    <button class="btn btn-success btn-sm" id="one_type_submit" type="button">保存</button>
                                    <button class="btn btn-success btn-sm" type="button">重置</button>
                                </div>
                            </div>

                        </div>

                    </div>
                </div>
            </div>

            <div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">新增业务类型</h4>
                        </div>

                        <div class="modal-body row">

                            <div class="col-md-9">
                                <div class="form-group">
                                    一级业务
                                    <select id="one_type_check" class="form-control selectpicker" data-live-search="true"></select>
                                </div>
                                <div class="form-group">
                                    类型名称：<input  id="two_type" value="" class="form-control">
                                </div>
                                <div class="form-group">
                                    样式：<input  id="logo" value="" class="form-control">
                                </div>
                                <div class="form-group">
                                    色值：<input  id="color" value="" class="form-control">
                                </div>
                                <div class="pull-right">
                                    <button class="btn btn-success btn-sm" id="two_type_submit" type="button">保存</button>
                                </div>
                            </div>

                        </div>

                    </div>
                </div>
            </div>


            <div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">编辑业务类型</h4>
                        </div>

                        <div class="modal-body row">

                            <div class="col-md-9" id="edit">
                                    <div class="form-group" id="edit_one_select">
                                        一级业务
                                        <select id="eone_type_check" class="form-control selectpicker" data-live-search="true"></select>
                                    </div>
                                   <div class="form-group" id="edit_type_name">
                                       <input type="hidden" id="bid">
                                       <input type="hidden" id="type">
                                       类型名称：<input  id="type_name" value="" class="form-control">
                                    </div>
                                    <div class="form-group">
                                        样式：<input  id="logo_name" value="" class="form-control">
                                    </div>
                                    <div class="form-group">
                                        色值：<input  id="color_name" value="" class="form-control">
                                        <button class="btn btn-success btn-sm" id="edit_type_submit" type="button">保存</button>
                                     </div>
                            </div>

                        </div>

                    </div>
                </div>
            </div>
            <!-- modal -->
            <!-- page end-->
        </section>


        <!--body wrapper end-->

        <!--footer section start-->
        <%@ include file="/page/common/footer.jsp" %>
        <!--footer section end-->


    </div>
    <!-- main content end-->
</section>

<!-- Placed js at the end of the document so the pages load faster -->
<script src="<%=path%>/resources/js/jquery-1.10.2.min.js"></script>
<script src="<%=path%>/resources/js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="<%=path%>/resources/js/jquery-migrate-1.2.1.min.js"></script>
<script src="<%=path%>/resources/js/bootstrap.min.js"></script>
<script src="<%=path%>/resources/js/bootstrap.min.js"></script>
<script src="<%=path%>/resources/js/bootstrap-table.js"></script>

<script src="<%=path%>/resources/js/modernizr.min.js"></script>
<script src="<%=path%>/resources/js/jquery.nicescroll.js"></script>
<script src="<%=path%>/resources/js/jquery-confirm.js"></script>
<!--common scripts for all pages-->
<script src="<%=path%>/resources/js/scripts.js"></script>
<script src="<%=path%>/resources/js/jquery.isotope.js"></script>

<script src="<%=path%>/resources/js/common.js"></script>
<script>
    var offset = -1;
    var $table = $('#table'), selections = [];
    $(function () {
        init_one_type();
        initData();
    });
    function init_one_type() {
        $.ajax({
            url: '<%=path %>/admin/btype/init_one_type.do',
            async: false,
            success: function (data) {
                $.each(data.data, function (idx, obj) {
                    var value = obj.bId;
                    $('#one_type_select').append('<option value=' + value + '>' + obj.bName + '</option>')
                    $('#one_type_check').append('<option value=' + value + '>' + obj.bName + '</option>')
                    $('#eone_type_check').append('<option value=' + value + '>' + obj.bName + '</option>')
                });
            }
        });
    }

    $('#one_type_select').on("change", function () {
        if ($('#one_type_select').val() == -1) {
            $('#one_type_select').find('option').remove();
            $('#two-type-select').find('option').remove();
            $('#one_type_select').append("<option value='-1'>全部</option>");
            $('#two_type_select').append("<option value='-1'>全部</option>");
            init_one_type();
        } else {
            $.ajax({
                url: '<%=basePath %>/admin/btype/get_two_type.do?&pid=' + $('#one_type_select').val(),
                async: false,
                success: function (data) {
                    $('#two_type_select').find('option').remove();
                    $('#two_type_select').append("<option value='-1'>全部</option>");
                    $.each(data.data, function (idx, obj) {
                        var value = obj.bId;
                        $('#two_type_select').append('<option value=' + value + '>' + obj.bName + '</option>')
                    });
                }
            });
        }
    });
    /*初始化表格数据*/
    function initData() {
        $('#table').bootstrapTable({
            url: "<%=path %>/admin/btype/business_type_select.do",
            clickToSelect: 'true',//选中一行
            queryParams: queryParams,
            columns: [{
                field: 'checked',
                checkbox: true
            }, {
                field: 'b_id',
                title: '编号',
                width: '150'
            }, {
                field: 'one_type',
                title: '类型名称',
                width: '150'
            }, {
                field: 'two_type',
                title: '上级类型',
                width: '150'
            }]
        });
    }

    /*刷新*/
    function search() {
        offset = 0;
        $table.bootstrapTable('refresh');
    }

    /**封装查询条件**/
    function queryParams(params) {
        if (offset == 0) {
            params.offset = offset;
        }
        offset = -1;
        var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            limit: params.limit,  //页面大小
            offset: params.offset, //页码
            one_id: $("#one_type_select").val(),
            two_id: $("#two_type_select").val(),
            searchKey: $("#searchKey").val(),
            maxrows: params.limit,
            pageindex: params.pageNumber
        };
        return temp;
    }


    $('#delType').on('click',function(){
        var ids = getIdSelections_del();
        var num = $table.bootstrapTable('getSelections').length;
        if(ids.length==0){
            alert("至少选择一条正确的记录");
        }else{
            if(num>ids.length){
                if(confirm("存在不符合停用条件的数据，确定忽略这些数据吗？")){
                    delType(ids)
                }
            }else{
                if(confirm("确定要删除吗？")){
                    delType(ids);
                }
            }
        }
    });
    $('#editType').on('click',function(){
        var id = getIdSelections();
        if(id.length==0){
            alert("至少选择一条正确的记录");
        }else if(id.length==1){
            $.ajax({
                type: "GET",
                url: "<%= basePath %>/admin/btype/editType.do",
                dataType:'json',
                data: { id : id.toString()},
                success: function(data){
                    if(data.code=='200'){
                        if(data.data.pid==0){
                            $("#type_name").val(data.data.bName);
                            $("#bid").val(data.data.bId);
                            $("#edit_one_select").hide();
                            $("#type").val(0);
                        }else{
                            $("#edit_one_select").show();
                            $("#eone_type_check").val(data.data.pid);
                            $("#type_name").val(data.data.bName);
                            $("#logo_name").val(data.data.logo);
                            $("#color_name").val(data.data.color);
                            $("#eone_type_check").val(data.data.pid);
                            $("#type").val(1);
                            $("#bid").val(data.data.bId);
                        }
                        $('#myModal3').modal("show");
                    }else{

                    }
                }
            });
        }else{
            alert("请选择一条正确的记录")
        }
    });
    $('#one_type_submit').on('click',function(){
        $.ajax({
            type: "POST",
            url: "<%= basePath %>/admin/btype/saveOneType.do",
            dataType:'json',
            data: { oneType : $("#one_type").val()},
            success: function(data){
                if(data.code=='200'){
                    alert("保存成功");
                    window.location.reload();//刷新当前页面.
                }else{
                    confirm("保存失败");
                }
            }
        });
    });

    $('#two_type_submit').on('click',function(){

        $.ajax({
            type: "POST",
            url: "<%= basePath %>/admin/btype/saveTwoType.do",
            dataType:'json',
            data: {
                twoType : $("#two_type").val(),
                pid : $("#one_type_check").val(),
                logo:$("#logo").val(),
                color:$("#color").val()
            },
            success: function(data){
                if(data.code=='200'){
                    alert("保存成功");
                    window.location.reload();//刷新当前页面.
                }else{
                    confirm("保存失败");
                }
            }
        });
    });

    $('#edit_type_submit').on('click',function(){
        var pid=0;
        if($("#type").val()!=0){
            pid=$("#eone_type_check").val();
        }
        $.ajax({
            type: "GET",
            url: "<%= basePath %>/admin/btype/updateType.do",
            dataType:'json',
            data: {
                type_name : $("#type_name").val(),
                logo : $("#logo_name").val(),
                color : $("#color_name").val(),
                pid :pid,
                bid:$("#bid").val()
            },
            success: function(data){
                if(data.code=='200'){
                    alert("保存成功");
                    window.location.reload();//刷新当前页面.
                }else{
                    confirm("保存失败");
                }
            }
        });
    });



    function getIdSelections_del() {
        return $.map($table.bootstrapTable('getSelections'), function (row) {
                return row.b_id;
        })
    }
    function getIdSelections() {
        return $.map($table.bootstrapTable('getSelections'), function (row) {
            return row.b_id;
        })
    }
    function delType(ids){
        $.ajax({
            type: "GET",
            url: "<%= basePath %>/admin/btype/delType.do",
            dataType:'json',
            data: { ids : ids.toString()},
            success: function(data){
                if(data.code=='200'){
                    alert("删除成功");
                    window.location.reload();//刷新当前页面.

                }else{
                    alert("删除失败");
                    window.location.reload();//刷新当前页面.
                }
            }
        });
    }
        $(function() {
            var $container = $('#gallery');
            $container.isotope({
                itemSelector: '.item',
                animationOptions: {
                    duration: 750,
                    easing: 'linear',
                    queue: false
                }
            });

            // filter items when filter link is clicked
            $('#filters a').click(function() {
                var selector = $(this).attr('data-filter');
                $container.isotope({filter: selector});
                return false;
            });
        });
    jQuery(document).ready(function($)
    {
        selectEffect("admin/btype/business_type_list.do");
    });

</script>
</body>
</html>

